import {Component, ViewChild} from '@angular/core';
import {PaginatorForm} from "../../../models/paginatorForm";
import {DatePipe} from "@angular/common";
import {UserService} from "../../service/user.service";
import {PromptService} from "../../../util/prompt/prompt.service";
import {RoleTypePipe} from "../../../util/pipe/rolelType.pipe";
import {CommonService} from "../../../util/common.service";
import {PermissionEntity} from "../../model/permissionEntity";
import {RoleEditForm} from "../../model/roleEditForm";
import {NavigationBarService} from "../../../site/service/navigationBar.service";
declare var $: any;
@Component({
    moduleId: module.id,
    selector: 'roleList-component',
    templateUrl: "./roleList.html"
})


export class RoleListComponent {

    @ViewChild('table') table: any;
    @ViewChild('permissionListTable') permissionListTable: any;
    @ViewChild('editModal') editModal: any;
    permissionList: PermissionEntity[] = []
    roleEditForm: RoleEditForm = new RoleEditForm();

    constructor(private userService: UserService, private promptService: PromptService, private commonService: CommonService) {
        this.commonService.setNavigationBar("角色列表")
    }

    async ngOnInit() {
        this.getUserList()
        this.getPermissionList()
        this.drawPermissionListTable()

    }

    getPermissionList() {
        this.userService.getPermissionAllList().then((data)=> {
            if (data.success) {
                this.permissionList = data.result;
                // console.log(this.permissionList)
            } else {
                this.promptService.warning(data.error.message)
            }

        })
    }


    getUserList() {
        $(this.table.nativeElement).bootstrapTable({
            url: this.commonService.getRequestProUrl() + "/api/user/get_role_list",
            dataType: "json",
            method: "post",
            pagination: true, //分页
            // clickToSelect: true,
            // singleSelect: false,
            sidePagination: "server", //服务端处理分页
            toolbar: '#toolbar',
            columns: [
                {
                    title: '角色名称',
                    field: 'name',
                }, {
                    title: '修改日期',
                    field: 'updateAt',
                    formatter: (value: any, row: any, index: any) => {
                        let result: any = new DatePipe("en-US").transform(value, "yyyy年MM月dd日");
                        return result
                    }
                }, {
                    title: '操作',
                    field: 'operate',
                    formatter: (value: any, row: any, index: any) => {
                        let result: any = ""
                        var style = "margin-right: 2px;cursor: pointer;margin-bottom:2px";
                        result += '<span  title="编辑" class="edit  fa fa-pencil" style="' + style + '"></span>'
                        return result;
                    },
                    events: {
                        'click .edit': (e: any, value: any, row: any, index: any)=> {
                            this.showEditRoleModal(row.id, row.name)
                        }
                    }
                }],
            responseHandler: (res: any) => {
                console.log(res)
                if (!res.success) {
                    this.promptService.warning(res.error.message)
                }
                return {
                    // "total": res.result.total,//总页数
                    // "rows": res.result.items   //数据
                    "total": res.paginator.total,
                    "rows": res.result   //数据
                };
            }
        })
    }

    showEditRoleModal(id: number, name: string) {
        this.userService.getRolePermissionAllList(id).then((data)=> {
            for (let permission of this.permissionList) {
                permission.checked = false;
            }
            this.roleEditForm = new RoleEditForm();
            this.roleEditForm.id = id;
            this.roleEditForm.name = name;
            this.roleEditForm.permissionList = this.permissionList;

            for (let permission of this.roleEditForm.permissionList) {
                permission.checked = false;
                for (let temp of data.result) {
                    if (temp.id == permission.id) {
                        permission.checked = true;
                    }
                }
            }
            $(this.permissionListTable.nativeElement).bootstrapTable("load", this.roleEditForm.permissionList)
            this.commonService.showModal(this.editModal)
        })
    }

    showAddRoleModal() {
        for (let permission of this.permissionList) {
            permission.checked = false;
        }
        this.roleEditForm = new RoleEditForm();
        this.roleEditForm.permissionList = this.permissionList;
        $(this.permissionListTable.nativeElement).bootstrapTable("load", this.roleEditForm.permissionList)
        this.commonService.showModal(this.editModal)
    }

    drawPermissionListTable() {
        $(this.permissionListTable.nativeElement).bootstrapTable({
            clickToSelect: true,
            columns: [
                {
                    field: 'checked',
                    checkbox: true,
                },
                {
                    title: '权限名称',
                    field: 'name',
                }],
            data: this.roleEditForm.permissionList
        })
    }


    editRole() {

        if (this.commonService.emptyStr(this.roleEditForm.name)) {
            this.promptService.warning("请输入角色名称")
            return false
        }

        if (this.roleEditForm.getResult().permissionIdList.length == 0) {
            this.promptService.warning("请至少选择一个权限")
            return false
        }


        this.userService.editRole(this.roleEditForm.getResult()).then((data)=> {
            if (data.success) {
                $(this.table.nativeElement).bootstrapTable("refresh")
                this.commonService.hideModal(this.editModal);
                this.promptService.info(data.result)
            } else {
                this.promptService.warning(data.error.message)
            }
        });

    }
}